<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>监管等级</title>
<link href="${request.contextPath}/static/css/layout.css" rel="stylesheet" type="text/css" />
<link href="${request.contextPath}/static/css/cb.css" rel="stylesheet" type="text/css" />
<link href="${request.contextPath}/static/css/n.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="${request.contextPath}/static/easyui/themes/default/easyui.css" />
<link rel="stylesheet" type="text/css" href="${request.contextPath}/static/easyui/themes/icon.css" />
<link rel="stylesheet" type="text/css" href="${request.contextPath}/static/easyui/demo/demo.css" />
<link rel="stylesheet" type="text/css" href="${request.contextPath}/static/js/laypage/skin/laypage.css" />
<script type="text/javascript" src="${request.contextPath}/static/easyui/jquery.min.js"></script>
<script type="text/javascript" src="${request.contextPath}/static/easyui/locale/easyui-lang-zh_CN.js"></script>
<script src="${request.contextPath}/static/js/vue/vue.min.js" charset="utf-8"></script>
<script type="text/javascript" src="${request.contextPath}/static/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="${request.contextPath}/static/js/laypage/laypage.js"></script>
<script type="text/javascript" src="${request.contextPath}/static/laydate/laydate.js"></script>
<body>
	<div id="app">
		<table width="99%" height="20" style="height:20px" border="0" align="center" cellpadding="0"
			cellspacing="0">
			<tr>
				<td width="1%" align="left" background="${request.contextPath}/static/images/b2.jpg"><img
					src="${request.contextPath}/static/images/b1.jpg" width="10" height="20" /></td>
				<td width="68%" background="${request.contextPath}/static/images/b2.jpg">
					<table width="150"
						border="0" align="left" cellpadding="0" cellspacing="0">
						<tr>
							<td width="20" align="left"><img src="${request.contextPath}/static/images/tz.gif"
								width="10" height="16" /></td>
							<td width="130" align="left" class="biao">查找矫正人员报到信息</td>
						</tr>
					</table>
				</td>
				<td width="31%" align="right" background="${request.contextPath}/static/images/b2.jpg"><img
					src="${request.contextPath}/static/images/b3.jpg" width="9" height="26" /></td>
			</tr>
		</table>

        <table width="99%" border="0" align="center" cellpadding="3"
               cellspacing="1" bgcolor="#AEDEF4">
            <tr>
                <td align="center" bgcolor="#E2F7FE">
                    <table width="80%" border="0" cellspacing="1" cellpadding="3">
                        <tr>
                            <td width="10%" align="right">矫正单位:</td>
                            <td width="10%" align="left">
                                <select id="jid1" onchange="getMovePersonel()">
                                    <option value="0">任意</option>
                                    <option v-for="j in jnames" :value="j.id">{{j.name}}</option>
                                </select>
                            </td>
                            <td width="10%" align="right">姓名:</td>
                            <td width="10%" align="left">
                                <select id="cid1" style="width:120px; height: 17px">
                                    <option value="0">任意</option>
                                    <option v-for="item in names" :value="item.id">{{item.name}}</option>
                                </select>
                            </td>
                            <td width="10%" align="left">
                                <input type="button" onclick="getPageList()" value="查 找"/>
                            </td>
                            <td width="10%" align="right">
                                <input type="button" onclick="addEvent()" value="增加记录"/>
                                <input type="button" onclick="deleteBut()" value="批量删除"/>
                            </td>
                            <td width="10%" align="right">
                                <input type="button" onclick="exportBut()" value="导出所选"/>
                                <input type="button" onclick="outExcel()" value="全部导出"/>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>

		<table width="50%" border="0" cellspacing="0" cellpadding="0">
			<tr>
				<td height="5"></td>
			</tr>
		</table>
		<table width="99%" border="0" align="center" cellpadding="0"
			cellspacing="0">
			<tr>
				<td width="1%" align="left" background="${request.contextPath}/static/images/b2.jpg"><img
					src="${request.contextPath}/static/images/b1.jpg" width="10" height="26" /></td>
				<td width="68%" background="${request.contextPath}/static/images/b2.jpg"><table width="124"
						border="0" align="left" cellpadding="0" cellspacing="0">
						<tr>
							<td width="20" align="left"><img src="${request.contextPath}/static/images/tz.gif"
								width="10" height="16" /></td>
							<td width="104" align="left" class="biao">矫正人员报到列表</td>
						</tr>
					</table></td>
				<td width="31%" align="right" background="${request.contextPath}/static/images/b2.jpg"><img
					src="${request.contextPath}/static/images/b3.jpg" width="9" height="26" /></td>
			</tr>
		</table>
		<table width="99%" border="0" align="center" cellpadding="3"
			cellspacing="1" bgcolor="#AEDEF4" style="border: 1px solid #AEDEF4">
			<thead>
				<tr>
                    <td align="center" bgcolor="#EFFBFE">
                        <input id="all" type="checkbox"/>
                    </td>
					<td width="5%" height="25" align="center" bgcolor="#EFFBFE">序号</td>
					<td width="14%" align="center" bgcolor="#EFFBFE">矫正单位</td>
					<td width="15%" align="center" bgcolor="#EFFBFE">姓名</td>
					<td align="center" bgcolor="#EFFBFE">报到日期</td>
					<td align="center" bgcolor="#EFFBFE">报到方式</td>
					<td align="center" bgcolor="#EFFBFE">报到表现</td>
					<td align="center" bgcolor="#EFFBFE">分值</td>
					<td align="center" bgcolor="#EFFBFE">得分</td>
					<td align="center" bgcolor="#EFFBFE">备注</td>
					<td align="center" bgcolor="#EFFBFE">管理操作</td>
				</tr>
			</thead>
			<tbody>
				<tr v-for="(item,index) in result"
					onmouseout="this.style.backgroundColor='#ffffff'" bgcolor="#ffffff"
					onmouseover="this.style.backgroundColor='#E6F2FF'">
                    <td align="center">
                        <input name="check" type="checkbox" :value="item.id"/>
                    </td>
					<td height="25" align="center">{{index+1}}</td>
					<td align="center" class="t5"><div align="center">
							<strong>{{item.jname}}</strong>
						</div></td>
					<td align="center">{{item.name}}</td>
					<td align="center">{{item.date}}</td>
					<td align="center">{{item.way}}</td>
					<td align="center">{{item.manifestation}}</td>
					<td align="center">{{item.score_value}}</td>
					<td align="center">{{item.score}}</td>
					<td align="center">{{item.remark}}</td>
					<td align="left">
						<div align="left" style="padding-left: 5px">
							<div align="center">
								<input type="button" @click="checkEvent(item.id)"
									name="" value="查看" /> 
									<input type="button" @click="editEvent(item.id)"
									name="" value="修改" /> <input type="button"
									@click="delEvent(item.id)" name="" value="删除" />
							</div>
						</div>
					</td>

				</tr>
				<tr>
					<td colspan="6" align="center">
						<div id="pagediv"></div>
					</td>
				</tr>
			</tbody>

		</table>
		<!-- 增加报到方式弹出框 -->
		<div id="dlg"></div>
		<!-- 查看报到方式弹出框 -->
		<div id="dlg1"></div>
		<!-- 修改报到方式弹出框 -->
		<div id="dlg2"></div>
	<!-- js代码控制增删改查弹出层 -->
	<script>
		var app = new Vue({
			el : '#app',
			data : {
                names: [],
                jnames: [],
				result : []
			}
		});
        //查找所有司法所
        var getJudicialDeptment = function () {
            $.ajax({
                url: "/judicialDeptment/queryAll",
                data: '',
                success: function (result) {
                    app.jnames = result.data;
                }
            });
        }
        //根据矫正单位查找所有服刑人员
        var getMovePersonel = function () {
            $.ajax({
                url: "/movePersonel/getAllCorrectedPerson",
                data: {
                    id: $('#jid1').val()
                },
                success: function (result) {
                    app.names = result.data;
                }
            });
        }
        getJudicialDeptment();
		//模糊查询
		var getPageList = function(curr) {
			$.ajax({
				dataType : "json",
				url : "${request.contextPath}/register/get",
				data : {
					pageNum : curr || 1,
					pageSize : 6,
					jid : $("#jid1").val(),
					id : $("#cid1").val()
				},
				//显示分页
				success : function(msg) {
					app.result = msg.data[0].result;
					laypage({
						cont : 'pagediv', //容器。值支持id名、原生dom对象，jquery对象,
						pages : msg.data[0].totalPage, //总页数
						first : "首页",
						last : "尾页",
						skip : true, //是否开启跳页
						skin : '#5675A2',
						curr : curr || 1, //当前页
						jump : function(obj, first) { //触发分页后的回调
							if (!first) { //点击跳页触发函数自身，并传递当前页：obj.curr
								getPageList(obj.curr);
							}
						}
					});
					invert();
				}
			});
		}
		
		//获取列表
		getPageList();
        //全选反选
        $(function () {
            // 复选框全选反选
            $("#all").click(function () {
                var isChecked = $(this).prop("checked");
                $("input[name='check']").prop("checked", isChecked);
            });
            //更改messager提示为中文
            $.extend($.messager.defaults, {
                ok: "确定",
                cancel: "取消"
            });
        })
        //反选
        var invert = function () {
            $("input[name='check']:checked").each(function () {
                if ($(this).attr("checked", true)) {
                    $(this).removeAttr("checked");
                }
            })
        }
		//增加期满登记事件
		var addEvent = function() {
			$('#dlg').dialog({
				title : '增加---报到方式',
				width : 720,
				height : 450,
				closed : false,
				cache : false,
				href : '${request.contextPath}/register/addSkip',
				modal : true,
				buttons : [ {
					text : '保存',
					iconCls : 'icon-ok',
					handler : function() {
						var addForm = new FormData($( "#form1" )[0]);
						$.ajax({
							type: 'POST',
							url : "${request.contextPath}/register/add",
							data : addForm,
							async: false,  
					        cache: false,  
					        contentType: false,  
					        processData: false, 
							success : function(result) {
								$.messager.alert({
									title : '消息',
									msg : '增加成功!',
									icon : 'info'
								});
								getPageList();
								$('#dlg').dialog('close');
							}
						});
					}
				}, {
					text : '取消',
					handler : function() {
						$('#dlg').dialog('close');
					}
				} ]
			});
		}
		
		//修改期满登记事件
		var editEvent = function(id) {
			$('#dlg2').dialog({
				title : '修改---报到方式',
				width : 720,
				height : 450,
				closed : false,
				cache : false,
				href : '${request.contextPath}/register/detail?id=' + id,
				modal : true,
				buttons : [ {
					text : '保存',
					iconCls : 'icon-ok',
					handler : function() {
						var editForm = new FormData($( "#form2" )[0]);
						$.ajax({
							type: 'POST',
							url : "${request.contextPath}/register/edit",
							data : editForm,
							async: false,  
					        cache: false,  
					        contentType: false,  
					        processData: false, 
							success : function(result) {
								$.messager.alert({
									title : '消息',
									msg : '修改成功!',
									icon : 'info'
								});
								getPageList();
								$('#dlg2').dialog('close');
							}
						});
					}
				}, {
					text : '取消',
					handler : function() {
						$('#dlg2').dialog('close');
					}
				} ]
			});
		}

		//查看报到登记详情事件
		var checkEvent = function(id) {	
			$('#dlg1').dialog({
				title : '查看---报到方式',
				width : 720,
				height : 450,
				closed : false,
				cache : false,
				href : '${request.contextPath}/register/look?id='+id,
				modal : true,
			});
		}

		//删除期满登记事件
		var delEvent = function(id) {
			$.extend($.messager.defaults,{
                ok:"确定",
                cancel:"取消"
            });
			$.messager.confirm('提示框', '你确定要删除吗?', function(res) {
				if (res) {
					$.ajax({
						url : "${request.contextPath}/register/del",
						dataType : "json",
						data : {
							id : id
						},
						success : function(result) {
							$.messager.alert({
								title : '消息',
								msg : '删除成功!',
								icon : 'info'
							});
							getPageList();
						}
					})
				} else {

				}
			})
		}
        //批量删除监管等级
        var deleteBut = function () {
            var ids = [];
            $("input[name='check']:checked").each(function () {
                ids.push($(this).val());
            })
            if (ids.length == 0) {
                $.messager.alert({
                    title: '消息',
                    msg: '请选择要删除的信息!',
                    icon: 'info'
                });
            } else {
                $.messager.confirm('提示框', '你确定要删除吗?',
                        function (res) {
                            if (res) {
                                $.ajax({
                                    url: "/register/deleteBatch",
                                    data: {
                                        ids: ids
                                    },
                                    success: function (result) {
                                        if (result.code == 0) {
                                            $.messager.alert({
                                                title: '消息',
                                                msg: '删除成功!',
                                                icon: 'info'
                                            });
                                            getPageList();
                                        }
                                    }
                                });
                            } else {
                                // 取消
                            }
                        })
            }
        }
		//导出Excel		
		function outExcel(){
	        var url = "${request.contextPath}/register/excel";
	        window.open(url);
	    }
        //批量导出
        var exportBut = function () {
            var ids = [];
            $("input[name='check']:checked").each(function () {
                ids.push($(this).val());
            })
            if (ids.length == 0) {
                $.messager.alert({
                    title: '消息',
                    msg: '请选择需要导出的信息!',
                    icon: 'info'
                });
            } else {
                $.messager.confirm('提示框', '你确定要导出吗?',
                        function (res) {
                            if (res) {
                                var url = "/register/excel?ids=" + ids;
                                window.open(url);
                            } else {
                                // 取消
                            }
                        })
            }
        }
	</script>
</body>
</html>